Ext.onReady(function() {  
	
	

	var store = Ext.create('Ext.data.TreeStore', {
        root: {
            expanded: true
        },
        proxy: {
            type: 'ajax',
            url: 'tree-data.json'
        }
    });
	
	 var treePanel = Ext.create('Ext.tree.Panel', {
	        id:'tree-panel',
	        title: 'Sample Layouts',
	        region:'north',
	        split: true,
	        height: 360,
	        minSize: 150,
	        rootVisible: false,
	        autoScroll: true,
	        store: store
	    });
	 
	 treePanel.getSelectionModel().on('select', function(selModel, record) {
	        if (record.get('leaf')) {
	         //  alert(record.getId());
	        	// Ext.getCmp('content-panel').layout.setActiveItem(record.getId());
	        	if(record.getId()=='altap'){
	           Ext.getCmp('content-panel').getLayout().setActiveItem(Ext.getCmp('form-panel-1'));
	        	}
	        	if(record.getId()=='bajap'){
	 	           Ext.getCmp('content-panel').getLayout().setActiveItem(Ext.getCmp('form-panel-2'));
	 	        	}
	         }
	    });
	 
	
		
	Ext.create('Ext.Viewport', {
        layout: 'border',
        title: 'Contabilidad digital',
        items: [{
            xtype: 'box',
            id: 'header',
            region: 'north',
            html: '<h1> Contabilidad digital</h1>',
            height: 30
        },{
            layout: 'border',
            id: 'layout-browser',
            region:'west',
            border: false,
            split:true,
            margins: '2 0 5 5',
            width: 275,
            minSize: 100,
            maxSize: 500,
            items:[treePanel]
        },
        {
        		         id: 'content-panel',
        		         region: 'center', // this is what makes this panel into a region within the containing layout
        		         layout: 'card',
        		         margins: '2 5 5 0',
        		         activeItem: 0,
        		         border: false
        		         
        		 
        }
   
        ]
    });  
});  